<template>
  <div class="add-version-container">
    <el-dialog title="新增版本号"
               :visible.sync="dialogVisible"
               width="50%"
               :before-close="handleClose">
      <el-row :gutter="20">
        <el-form ref="requestParam"
                 :model="requestParam"
                 :rules="rules"
                 label-width="80px">
          <el-col :span="24">
            <el-form-item label="版本号"
                          prop="name">
              <el-input placeholder="请输入版本号"
                        v-model="requestParam.name">
              </el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24"
                  class="bottom-box">
            <el-button type="primary"
                       @click="onSure('requestParam')">确定</el-button>
            <el-button @click="onCancel">取消</el-button>
          </el-col>
        </el-form>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
import { ProjectListApi, draweManagementApi, projectDecomApi } from "@/services/ProjectCenter";
export default {
  props: {//传参
    versionVisible: {
      type: Boolean,
      default: () => {
        return false
      }
    },
    objRow: {
      type: Object,
      default: () => {
        return { project_id: '' }
      }
    },
    catchBackFunc: {
      type: Function,
    }
  },
  data () {
    return {
      dialogVisible: false,
      requestParam: {
        project_id: '',//关联的项目主键值
        name: ''
      },
      rules: {
        name: [
          { required: true, message: '版本号不能为空', trigger: ['blur', 'change'] }
        ]
      }

    }
  },
  methods: {
    handleClose (done) {
      this.onCancel();
      this.dialogVisible = false;
      done()
    },
    commonFunc () {
      this.$emit('update:objRow', {});
      this.$emit('update:versionVisible', false);
    },
    onCancel () {//取消
      this.catchBackFunc('close');
      this.$refs.requestParam.resetFields();
      this.commonFunc();//通用函数
    },
    createVer () {//创建版本号
      draweManagementApi.saveVer({
        data: this.requestParam
      }).then((res) => {
        if (res.code == 0) {
          this.catchBackFunc('save');
          this.commonFunc();//通用函数
          this.$message.success('操作成功')
        }
      }).catch((error) => {
        console.log(error)
      })
    },
    onSure (data) {//确定
      this.$refs[data].validate((valid) => {
        if (valid) {
          this.createVer();//创建版本号
        } else {
          return false;
        }
      })
    }
  },
  watch: {//监听
    versionVisible (n, o) {
      this.requestParam.project_id = this.objRow.project_id;
      this.dialogVisible = n;
    }
  },
  created () {
    this.requestParam.project_id = this.objRow.project_id;
    this.dialogVisible = this.versionVisible;
  }
}
</script>

<style lang="scss" scoped>
.add-version-container {
  .bottom-box {
    text-align: center;
    margin-top: 20px;
  }
}
</style>